import {
  PageHeader,
  Checkbox,
  Form,
  Input,
  Button,
  Row,
  Col,
  InputNumber,
  Select,
  Switch
} from 'antd';
import { useNavigate } from "react-router-dom"
import CateSelect from '@/components/CateSelect'

import "./style.scss"

export default (props) => {
  const navigate = useNavigate();
  const [form] = Form.useForm();
  const onFinish = (values) => {
    console.log(values);
  };
  return (
    <div className='good-form'>
      <PageHeader
        className="site-page-header"
        onBack={() => navigate(-1)}
        title="商品新增"
        style={{ background: "#fff" }}
      />
      <div className="form">
        <Form
          form={form}
          name="goodAddEdit"
          labelCol={{ span: 2 }}
          wrapperCol={{ span: 10 }}
          labelAlign="left"
          onFinish={onFinish}
        >
          <Form.Item
            name="name"
            label="商品名称"
            rules={[
              { required: true, message: "商品名称是必填项" }
            ]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            name="desc"
            label="商品描述"
            rules={[
              { required: true, message: "商品描述是必填项" }
            ]}
          >
            <Input.TextArea />
          </Form.Item>
          <Form.Item
            name="cate"
            label="商品品类"
            rules={[
              { required: true, message: "商品品类是必填项" }
            ]}
          >
            <CateSelect />
          </Form.Item>
          <Form.Item
            name="price"
            label="商品价格"
            rules={[
              { required: true, message: "商品价格是必填项" }
            ]}
          >
            <InputNumber />
          </Form.Item>
          <Form.Item
            name="hot"
            label="是否热销"
            rules={[
              // { required: true, message: "商品价格是必填项" }
            ]}
          >
            <Switch />
          </Form.Item>

          <Form.Item>
            <Button type='primary' htmlType='submit'>提交</Button>
          </Form.Item>
        </Form>
      </div>
    </div>
  )
}